<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:rich="http://richfaces.org/rich"
      xmlns:f="http://java.sun.com/jsf/core">
    <body>
        <ui:composition template="./main-template.xhtml">
            <ui:param name="titulo" value="Tienda Virtual - Catalogo" />
            <ui:define name="body">
                <h:messages showDetail="true" showSummary="true"/>
                <rich:panel>
                    <f:facet name="header" >
                        Tienda Virtual - Catalogo
                    </f:facet>
                    <h:panelGrid id="panelEditar">
                        <rich:panel rendered="#{CatalogoVirtualBean.mostrarEditar}">
                            <f:facet name="header" >
                                Dettalle del Mueble
                            </f:facet>
                            <a4j:form>
                                <h:panelGrid columns="2">
                                    <h:outputLabel value="Referencia" styleClass="label"/>
                                    <h:outputLabel value="Nombre" styleClass="label"/>
                                    <h:outputText value="#{CatalogoVirtualBean.mueble.referencia}"/>
                                    <h:outputText value="#{CatalogoVirtualBean.mueble.nombre}"/>
                                </h:panelGrid>
                                <h:panelGrid>
                                    <h:outputLabel value="Descripcion" styleClass="label"/>
                                    <h:inputTextarea value="#{CatalogoVirtualBean.mueble.descripcion}" rows="5" disabled="true"/>
                                </h:panelGrid>
                                <h:panelGrid columns="2">
                                    <h:outputLabel value="Tipo Muebles" styleClass="label"/>
                                    <h:outputLabel value="Alto" styleClass="label"/>
                                    <h:outputText value="#{CatalogoVirtualBean.mueble.tipo}"/>
                                    <h:outputText value="#{CatalogoVirtualBean.mueble.alto}"/>
                                    <h:outputLabel value="Ancho(cm)" styleClass="label"/>
                                    <h:outputLabel value="Profundidad(cm)" styleClass="label"/>
                                    <h:outputText value="#{CatalogoVirtualBean.mueble.ancho}"/>
                                    <h:outputText value="#{CatalogoVirtualBean.mueble.profundidad}"/>
                                    <h:outputLabel value="Color" styleClass="label"/>
                                    <h:outputLabel value="Peso (gr)" styleClass="label"/>
                                    <h:outputText value="#{CatalogoVirtualBean.mueble.color}"/>
                                    <h:outputText value="#{CatalogoVirtualBean.mueble.peso}"/>
                                </h:panelGrid>
                                <h:panelGrid columns="2">
                                    <a4j:commandButton value="Agregar al Carrito" action="#{CatalogoVirtualBean.agregarCarritoCompra}" reRender="tblMuebles" />
                                    <a4j:commandButton value="Regresar" reRender="panelEditar">
                                        <f:setPropertyActionListener value="false" target="#{CatalogoVirtualBean.mostrarEditar}"/>
                                    </a4j:commandButton>
                                </h:panelGrid>
                            </a4j:form>
                        </rich:panel>
                    </h:panelGrid>
                    <rich:panel>
                        <a4j:form>
                            <rich:extendedDataTable id="tableCatalogo" value="#{CatalogoVirtualBean.productos}" var="mueble" height="800px">
                                <rich:column filterBy="#{mueble.referencia}" sortBy="#{mueble.referencia}" label="Referencia">
                                    <f:facet name="header">
                                        Referencia
                                    </f:facet>
                                    #{mueble.referencia}
                                </rich:column>
                                <rich:column filterBy="#{mueble.nombre}" sortBy="#{mueble.nombre}" label="Nombre">
                                    <f:facet name="header">
                                        Nombre
                                    </f:facet>
                                    #{mueble.nombre}
                                </rich:column>
                                <rich:column filterBy="#{mueble.material}" sortBy="#{mueble.material}" label="Material">
                                    <f:facet name="header">
                                        Descripción
                                    </f:facet>
                                    #{mueble.material}
                                </rich:column>
                                <rich:column>
                                    <f:facet name="header" >
                                        Opciones
                                    </f:facet>
                                    <a4j:commandLink title="Ver Detalle" immediate="true" reRender="panelEditar">
                                        <f:setPropertyActionListener value="#{mueble}" target="#{CatalogoVirtualBean.mueble}"/>
                                        <f:setPropertyActionListener value="true" target="#{CatalogoVirtualBean.mostrarEditar}"/>
                                        <h:graphicImage url="/img/edit.gif" styleClass="icon"/>
                                    </a4j:commandLink>
                                </rich:column>
                                <rich:column label="Agregar a carrito" width="20%">
                                    <f:facet name="header" >
                                        Agregar al Carrito
                                    </f:facet>
                                    <a4j:commandLink title="Agregar al Carrito" action="#{CatalogoVirtualBean.agregarCarritoCompra}"
                                                     immediate="true">
                                        <f:setPropertyActionListener value="#{mueble}" target="#{CatalogoVirtualBean.mueble}"/>
                                        <h:graphicImage url="/img/carrito.png" styleClass="icon"/>
                                    </a4j:commandLink>
                                </rich:column>
                                <rich:column label="Imagen" width="30%">
                                    <f:facet name="header" >
                                        Imagen
                                    </f:facet>
                                    <a4j:mediaOutput element="img"
                                                     createContent="#{CatalogoVirtualBean.paint}" value="#{mueble.foto}"
                                                     style="width:100px; height:100px;" cacheable="false">
                                    </a4j:mediaOutput>
                                </rich:column>
                            </rich:extendedDataTable>
                        </a4j:form>
                    </rich:panel>
                </rich:panel>
            </ui:define>
        </ui:composition>
    </body>
</html>

